<!DOCTYPE html>
<html>
<head>
<style>
.fail {
    color: red;
    font-weight: bold;
}

.pass {
    color: green;
    font-weight: bold;
}
</style>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
var htmlContent =
                "<html>" +
                    "<head>" +
                        "<noscript>" +
                            "Scripts must be disabled for the document created using DOMParser.parseFromString()" +
                        "</noscript>" +
                    "</head>" +
                    "<body>" +
                        "<div id='text'>Sample text content</div>" +
                        "<script>document.getElementById('text').textContent = 'Modified text content';<\/script>" +
                    "</body>" +
                "</html>";

var xmlContent =
                "<root>" +
                "</root>";


var xhtmlContent =
                "<!DOCTYPE html>" +
                "<html xmlns=\"http://www.w3.org/1999/xhtml\">" +
                    "<head>" +
                        "<title>Title of document</title>" +
                        "<noscript>" +
                            "Scripts must be disabled for the document created using DOMParser.parseFromString()" +
                        "</noscript>" +
                    "</head>" +
                    "<body>" +
                        "<div id='text'></div>" +
                        "<script>document.getElementById('text').textContent = 'Newly added text';<\/script>" +
                    "</body>" +
                "</html>";

var svgImageContent =
                "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\">" +
                    "<circle cx=\"100\" cy=\"50\" r=\"40\" stroke=\"black\" stroke-width=\"2\" fill=\"red\"/>" +
                "</svg>";

var xslContent =
                "<?xml version=\"1.0\"?>" +
                "<xsl:stylesheet version=\"1.0\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\">" +
                    "<xsl:template match=\"/\">" +
                        "<html>" +
                            "<head>" +
                                "<title>XML XSL Example</title>" +
                                "<style type=\"text/css\">" +
                                    "body" +
                                    "{" +
                                        "background-color:red;" +
                                    "}" +
                                "</style>" +
                            "</head>" +
                            "<body>" +
                                "<xsl:apply-templates/>" +
                            "</body>" +
                        "</html>" +
                    "</xsl:template>" +
                    "" +
                    "<xsl:template match=\"tutorial\">" +
                        "<span><xsl:value-of select=\"name\"/></span>" +
                        "<span><xsl:value-of select=\"url\"/></span>" +
                    "</xsl:template>" +
                "</xsl:stylesheet>";

var count = 0;

function shouldSupport(content, mimeType)
{
    var parser = new DOMParser();
    var resultDocument = parser.parseFromString(content, mimeType);
    assert_not_equals(resultDocument, null, 'Should support mime-type = ' + mimeType);
}

function shouldThrowException(content, mimeType)
{
    var parser = new DOMParser();
    assert_throws_js(TypeError, () => { parser.parseFromString(content, mimeType); });
}

test(() => {
    shouldSupport(htmlContent, "text/html");
    shouldSupport(xmlContent, "text/xml");
    shouldSupport(xmlContent, "application/xml");
    shouldSupport(xhtmlContent, "application/xhtml+xml");
    shouldSupport(svgImageContent, "image/svg+xml");
    shouldThrowException(xslContent, "text/xsl");
    shouldThrowException(xmlContent, "text/dummy+xml");
    shouldThrowException(xmlContent, "text/XML");
    shouldThrowException(xmlContent, "TEXT/html");
}, "This tests DOMParser supports creating Document for HTML content with mime-type 'text/html'");
</script>
</head>
<body>
</body>
</html>
